@charset "utf-8" ;


/*	Name: 상산				*/
/*	PART: Site All Style	*/
/*	Version: 1.0				*/
/*	Author: UHEE			*/



@media(min-width:768px){
/* INPUT */
input[title*="전화번호"], input[title*="휴대폰"], input[title*="팩스"], input[title*="이메일"]{width:40px}

/* LAYOUT */
.header{width:708px; height:171px; margin:0 auto; }

.container{position:relative; width:708px; margin:10px auto 0}
.container span.round{display:block; background:url(../images/bg_round.jpg) no-repeat 0 0; width:5px; height:5px}
.container span.lt{display:block; position:absolute; left:0; top:0; background-position:0 0}
.container span.rt{display:block; position:absolute; right:0; top:0; background-position:-5px 0}
.container span.lb{display:block; position:absolute; left:0; bottom:0; background-position:0 -5px}
.container span.rb{display:block; position:absolute; right:0; bottom:0; background-position:-5px -5px}
.container .container_area{border:1px solid #d2d2d2; padding:40px 20px}

/* 컨테이너 나뉠경우 */
.content_wrap{margin-top:10px}
/*.content_wrap:after{content:""; display:block; clear:both}*/
.content_wrap .con_left{width:100%; padding-right:10px;}
.content_wrap .con_right{width:100%; /*padding:0 30px; */ margin-left:-10px; border:0}

/* Footer */
.footer{width:100%; min-width:708px; border-top:1px solid #e9ebeb; margin-top:100px}
.footer .footer_area{width:708px; margin:0 auto; padding:30px 0}
.footer_area > address, 
.footer_area .address_set,
.footer_area > p{font-family:"맑은고딕", Malgun Gothic, '돋움', dotum, Helvetica; color:#333; letter-spacing:-1px; text-align:center; line-height:17px}
.footer_area .address_set{width:100%; *zoom:1}
.footer_area .address_set:after{content:""; display:block; clear:both}
.footer_area .address_set > li{display:inline-block; background:url(../images/bg_footer.gif) no-repeat 0 center; margin-left:8px; padding-left:8px}
.footer_area .address_set > li:first-child{margin-left:0; padding-left:0; background:none}
.footer_area .address_set .add_text{letter-spacing:0; color:#333}
.footer_area > p{margin-top:3px}

/* GNB */
.gnb_area{}
.gnb_area:after{content:""; display:block ;clear:both}
.gnb_area > li{float:left; position:relative; height:35px; padding:0 8px; margin-top:10px}
.gnb_area > li > a{font-size:15px; font-weight:bold; letter-spacing:-1px; color:#fff; font-family:"맑은고딕", Malgun Gothic, '돋움', dotum, Helvetica  ; }
.gnb_area > li.menu_dep1:hover, 
.gnb_area > li.on {background:url(../images/bg_gnb.jpg) no-repeat center 100%}
.gnb_area > li.menu_dep1:hover > a,
.gnb_area > li.on > a {text-decoration:underline}
.gnb_area > li > ul{padding-top:20px; *zoom:1} /* 2dep */
.gnb_area > li > ul:after{content:""; display:block; clear:both}
.gnb_area > li > ul > li{float:left; background:url(../images/bg_gnb.gif) no-repeat 0 7px; padding:0 10px}
.gnb_area > li > ul > li:first-child{background:none; padding-left:0}
.gnb_area > li > ul > li > a{color:#333; font-family:"맑은고딕", Malgun Gothic, '돋움', dotum ; font-size:14px; letter-spacing:-1px; font-weight:bold }
.gnb_area > li > ul > li:hover > a{ color:#ec0815; }
.gnb_area > li.menu_dep1 .menu2dep_m2{position:absolute; left:0.5em; top:30px; width:220px}
.gnb_area > li.menu_dep1 .menu2dep_m4{position:absolute; right:-25px; top:30px; width:450px}
.gnb_area > li.menu_dep1 .menu2dep_m5{position:absolute; right:-25px; top:30px; width:450px}
.gnb_area > li.menu_dep1 .menu2dep_m6{position:absolute; right:-60px; top:30px; width:550px}

/* 관리자 용 메뉴 */
.gnb_area_admin{}
.gnb_area_admin:after{content:""; display:block ;clear:both}
.gnb_area_admin > li{float:left; position:relative; height:35px; padding:0 2px; margin-top:10px}
.gnb_area_admin > li > a{font-size:15px; font-weight:bold; letter-spacing:-1px; color:#fff; font-family:"맑은고딕", Malgun Gothic, '돋움', dotum, Helvetica ; line-height:24px }
.gnb_area_admin > li.menu_dep1:hover, 
.gnb_area_admin > li.on {background:url(../images/bg_gnb.jpg) no-repeat center 100%}
.gnb_area_admin > li.menu_dep1:hover > a,
.gnb_area_admin > li.on > a {text-decoration:underline}
.gnb_area_admin > li > ul{padding-top:20px; *zoom:1} /* 2dep */
.gnb_area_admin > li > ul:after{content:""; display:block; clear:both}
.gnb_area_admin > li > ul > li{float:left; background:url(../images/bg_gnb.gif) no-repeat 0 7px; padding:0 10px}
.gnb_area_admin > li > ul > li:first-child{background:none}
.gnb_area_admin > li > ul > li > a{color:#333; font-family:"맑은고딕", Malgun Gothic, '돋움', dotum ; font-size:15px; letter-spacing:-1px;  font-weight:bold; }
.gnb_area_admin > li > ul > li:hover > a{ color:#ec0815;}
.gnb_area_admin > li.menu_dep1 .menu2dep_m2{position:absolute; left:-5px; top:30px; width:250px}
.gnb_area_admin > li.menu_dep1 .menu2dep_m4{position:absolute; right:-25px; top:30px; width:450px}
.gnb_area_admin > li.menu_dep1 .menu2dep_m5{position:absolute; right:-1.3em; top:30px; width:450px}
.gnb_area_admin > li.menu_dep1 .menu2dep_m6{position:absolute; right:-60px; top:30px; width:550px}

.gnb_area_admin > li.menuOn{background:url(../images/bg_gnb.jpg) no-repeat center 100%}
.gnb_area_admin > li.menuOn > a{text-decoration:underline}
.gnb_area_admin > li > ul > li#menuSubOn > a{ color:#ec0815; font-weight:bold;}

/* Login */
.bg_type_login{width:100%; min-width:768px; background:none/*url(../images/bg_login.jpg) repeat-x 0*/}
.bg_type_login .tit_h1{padding-top:155px; width:768px; margin:0 auto}
.login_box{margin-top:13px; margin-bottom:210px; background-color:#ed1b24; height:314px; border-top:1px solid #b10e15; border-bottom:1px solid #b10e15; }
.content{width:768px; /*height:237px; */margin:0 auto}
.content:after{content:""; display:block; clear:both}
.content .bg_area{float:left; background:url(../images/bg_log.jpg) no-repeat 0 50px; background-size:100%; margin:51px 0 25px 0; width:350px; height:237px; font-size:0; line-height:0; }
.content .login_area{float:left; width:360px; padding-left:45px; }
.content .login_area .login{/*width:380px; */margin-top:35px; padding-bottom:15px}
.content .login_area .login:after{content:""; display:block; clear:both}
.content .login_area .login .left{float:left}
.content .login_area .login .left > li{margin-top:10px}
.content .login_area .login .left > li:first-child label{width:77px}
.content .login_area .login .left > li label{display:inline-block; width:75px; font-size:18px; font-family:"맑은고딕", Malgun Gothic, '돋움', dotum; letter-spacing:-1px; color:#fff; vertical-align:middle}
.content .login_area .login .left > li input{border:0; height:26px; width:170px}
.content .login_area .login .right{display:block; float:left; background-color:#fff; width:100px; padding:26px 0; margin-left:10px; margin-top:10px; /*height:70px; */font-size:18px; text-align:center; font-weight:bold }
.content .login_area .text{background:url(../images/bg_log_var.jpg) no-repeat 0 0; padding-top:30px; }
.content .login_area .text > li{background:url(../images/bg_login_var2.png) no-repeat 0 7px; padding-left:8px; letter-spacing:-1px; color:#fff; line-height:18px}


/* 컨텐츠 */
/* 업무연락 체크박스 */
.table_write .check_area{}
.table_write .check_area:after{content:""; display:block ; clear:both}
.table_write .check_area > li{float:left; width:25%; padding-left:0}
.table_write .check_area input[type=checkbox]{margin-right:3px}
.table_write .check_area_result{}
.table_write .check_area_result > li{display:block;}

/* 담당자 등록 */
.table_img_box img{width:139px; height:151px; overflow:hidden}

/* 그래프 */
.view_more{display:block ; background:url(../images/ico_set.png) no-repeat 0 -135px; width:46px; height:15px; padding:5px 0 0 5px; position:relative; left:590px; top:-40px; z-index:10 }
.view_more.type_water{position:relative; left:590px; top:-60px}
.view_all{display:block ; background:url(../images/ico_set.png) no-repeat 0 -111px; width:56px; height:17px; padding:3px 0 0 5px; margin-bottom:10px; margin-left:585px}

/* 그래프 페이지 */
/* 그래프 상단 인풋 */
.container_graph{min-width:768px}
.container_graph .tit_h2{padding-left:8%; color:#fff}
.srch_wrap.type_graph{text-align:left; width:100%; background-color:#000}
.srch_wrap.type_graph:after{content:""; display:block; clear:both}
.srch_wrap.type_graph .srch_section1{float:none; width:100%; margin-left:0; text-align:center}
.srch_wrap.type_graph .srch_section2{float:none; margin-top:13px; width:100%; height:28px; background:url(../images/img_graph.png) no-repeat center 0}
.srch_wrap.type_graph .srch_section1 .date{margin-left:-2px}

/* 그래프위치 */
.graph_sec1{background-color:#000}
.graph_sec1 .graph_float_area{width:644px;  /*border-top:1px solid #c8caca; border-left:1px solid #c8caca;*/}
.graph_sec1 .graph_float_area:after{content:""; display:block; clear:both}
.graph_sec1 .graph_float_area > li{float:none; overflow:hidden; width:643px; /*border-bottom:1px solid #c8caca; border-right:1px solid #c8caca; */}
.graph_sec1 .graph_float_area .graph_area .graph_header{border-top:0}
.graph_sec1 .graph_float_area .graph_area .graph_box{margin-top:-50px; padding-bottom:20px;}
.graph_sec1 .graph_float_area .highcharts-legend{display:none}
.graph_sec2{margin-top:50px; background-color:#000}
.graph_sec2 .graph_float_area{width:644px; /*border-top:1px solid #c8caca; border-left:1px solid #c8caca;*/}
.graph_sec2 .graph_float_area:after{content:""; display:block; clear:both}
.graph_sec2 .graph_float_area > li{float:none; overflow:hidden; width:643px; /*border-bottom:1px solid #c8caca; border-right:1px solid #c8caca; */}
.graph_sec2 .graph_float_area .graph_area .graph_header{border-top:0}
.graph_sec2 .graph_float_area .graph_area .graph_box{margin-top:-50px; padding-bottom:20px;}
/*.graph_sec2 .graph_float_area .highcharts-legend{display:none}*/
.container_graph .ico_print{position:absolute; right:20px; top:185px; width:44px; overflow:hidden; }

}

@media(min-width:1024px){
/* INPUT */
input[title*="전화번호"], input[title*="휴대폰"], input[title*="팩스"], input[title*="이메일"]{width:70px}

/* LAYOUT */
.header{width:964px; height:171px; margin:0 auto; }

.container{position:relative; width:964px; margin:10px auto 0}
.container span.round{display:block; background:url(../images/bg_round.jpg) no-repeat 0 0; width:5px; height:5px}
.container span.lt{display:block; position:absolute; left:0; top:0; background-position:0 0}
.container span.rt{display:block; position:absolute; right:0; top:0; background-position:-5px 0}
.container span.lb{display:block; position:absolute; left:0; bottom:0; background-position:0 -5px}
.container span.rb{display:block; position:absolute; right:0; bottom:0; background-position:-5px -5px}
.container .container_area{border:1px solid #d2d2d2; padding:40px 20px}

/* 컨테이너 나뉠경우 */
.content_wrap{margin-top:10px}
.content_wrap:after{content:""; display:block; clear:both}
.content_wrap .con_left{float:left; width:350px; padding-right:10px;}
.content_wrap .con_right{float:left; width:550px; padding-left:10px; margin-left:0; border-left:1px solid #c8caca}

/* Footer */
.footer{width:100%; min-width:964px; border-top:1px solid #e9ebeb; margin-top:100px}
.footer .footer_area{width:964px; margin:0 auto; padding:30px 0}
.footer_area > address, 
.footer_area .address_set,
.footer_area > p{font-family:"맑은고딕", Malgun Gothic, '돋움', dotum, Helvetica  ; color:#333; letter-spacing:-1px; text-align:center; line-height:17px}
.footer_area .address_set{width:100%; *zoom:1}
.footer_area .address_set:after{content:""; display:block; clear:both}
.footer_area .address_set > li{display:inline-block; background:url(../images/bg_footer.gif) no-repeat 0 center; margin-left:8px; padding-left:8px}
.footer_area .address_set > li:first-child{margin-left:0; padding-left:0; background:none}
.footer_area .address_set .add_text{letter-spacing:0; color:#333}
.footer_area > p{margin-top:3px}

/* GNB */
.gnb_area{}
.gnb_area:after{content:""; display:block ;clear:both}
.gnb_area > li{float:left; position:relative; height:35px; padding:0 20px; margin-top:10px}
.gnb_area > li > a{font-size:17px; font-weight:bold; letter-spacing:-1px; color:#fff; font-family:"맑은고딕", Malgun Gothic, '돋움', dotum, Helvetica ; }
.gnb_area > li.menu_dep1:hover, 
.gnb_area > li.on {background:url(../images/bg_gnb.jpg) no-repeat center 100%}
.gnb_area > li.menu_dep1:hover > a,
.gnb_area > li.on > a {text-decoration:underline}
.gnb_area > li > ul{padding-top:20px; *zoom:1} /* 2dep */
.gnb_area > li > ul:after{content:""; display:block; clear:both}
.gnb_area > li > ul > li{float:left; background:url(../images/bg_gnb.gif) no-repeat 0 7px; padding:0 10px}
.gnb_area > li > ul > li:first-child{background:none; padding-left:0}
.gnb_area > li > ul > li > a{color:#333; font-family:"맑은고딕", Malgun Gothic, '돋움', dotum ; font-size:15px; letter-spacing:-1px; font-weight:bold }
.gnb_area > li > ul > li:hover > a{ color:#ec0815; }
.gnb_area > li.menu_dep1 .menu2dep_m2{position:absolute; left:1.5em; top:30px; width:250px}
.gnb_area > li.menu_dep1 .menu2dep_m4{position:absolute; right:0; top:30px; width:450px}
.gnb_area > li.menu_dep1 .menu2dep_m5{position:absolute; right:0; top:30px; width:450px}
.gnb_area > li.menu_dep1 .menu2dep_m6{position:absolute; right:-25px; top:30px; width:550px}

/* 관리자 용 메뉴 */
.gnb_area_admin{}
.gnb_area_admin:after{content:""; display:block ;clear:both}
.gnb_area_admin > li{float:left; position:relative; height:35px; padding:0 12px; margin-top:10px}
.gnb_area_admin > li > a{font-size:17px; font-weight:bold; letter-spacing:-1px; color:#fff; font-family:"맑은고딕", Malgun Gothic, '돋움', dotum, Helvetica ; line-height:24px }
.gnb_area_admin > li.menu_dep1:hover, 
.gnb_area_admin > li.on {background:url(../images/bg_gnb.jpg) no-repeat center 100%}
.gnb_area_admin > li.menu_dep1:hover > a,
.gnb_area_admin > li.on > a {text-decoration:underline}
.gnb_area_admin > li > ul{padding-top:20px; *zoom:1} /* 2dep */
.gnb_area_admin > li > ul:after{content:""; display:block; clear:both}
.gnb_area_admin > li > ul > li{float:left; background:url(../images/bg_gnb.gif) no-repeat 0 7px; padding:0 10px}
.gnb_area_admin > li > ul > li:first-child{background:none}
.gnb_area_admin > li > ul > li > a{color:#333; font-family:"맑은고딕", Malgun Gothic, '돋움', dotum ; font-size:15px; letter-spacing:-1px;  font-weight:bold; }
.gnb_area_admin > li > ul > li:hover > a{ color:#ec0815;}
.gnb_area_admin > li.menu_dep1 .menu2dep_m2{position:absolute; left:5px; top:30px; width:250px}
.gnb_area_admin > li.menu_dep1 .menu2dep_m4{position:absolute; right:0; top:30px; width:450px}
.gnb_area_admin > li.menu_dep1 .menu2dep_m5{position:absolute; right:-0.4em; top:30px; width:450px}
.gnb_area_admin > li.menu_dep1 .menu2dep_m6{position:absolute; right:0; top:30px; width:550px}

.gnb_area_admin > li.menuOn{background:url(../images/bg_gnb.jpg) no-repeat center 100%}
.gnb_area_admin > li.menuOn > a{text-decoration:underline}
.gnb_area_admin > li > ul > li#menuSubOn > a{ color:#ec0815; font-weight:bold;}

/* Login */
.bg_type_login{width:100%; min-width:1024px; background:none/*url(../images/bg_login.jpg) repeat-x 0*/}
.bg_type_login .tit_h1{padding-top:155px; width:1024px; margin:0 auto}
.login_box{margin-top:13px; margin-bottom:210px; background-color:#ed1b24; height:314px; border-top:1px solid #b10e15; border-bottom:1px solid #b10e15; }
.content{width:1024px; /*height:237px; */margin:0 auto}
.content:after{content:""; display:block; clear:both}
.content .bg_area{float:left; background:url(../images/bg_log.jpg) no-repeat 0 0; margin:51px 0 25px 0; width:451px; height:237px; font-size:0; line-height:0; }
.content .login_area{float:left; width:495px; padding-left:45px; }
.content .login_area .login{/*width:380px; */margin-top:50px; padding-bottom:20px}
.content .login_area .login:after{content:""; display:block; clear:both}
.content .login_area .login .left{float:left}
.content .login_area .login .left > li{margin-top:10px}
.content .login_area .login .left > li label{display:inline-block; width:90px; font-size:18px; font-family:"맑은고딕", Malgun Gothic, '돋움', dotum; letter-spacing:-1px; color:#fff; vertical-align:middle}
.content .login_area .login .left > li:first-child label{width:92px}
.content .login_area .login .left > li input{border:0; height:26px; width:178px}
.content .login_area .login .right{display:block; float:left; background-color:#fff; width:100px; padding:26px 0; margin-left:10px; margin-top:10px; /*height:70px; */font-size:18px; text-align:center; font-weight:bold }
.content .login_area .text{background:url(../images/bg_log_var.jpg) no-repeat 0 0; padding-top:30px; }
.content .login_area .text > li{background:url(../images/bg_login_var2.png) no-repeat 0 7px; padding-left:8px; letter-spacing:-1px; color:#fff; line-height:18px}
/* Login e */

/* 컨텐츠 */
/* 업무연락 체크박스 */
.table_write .check_area{}
.table_write .check_area > li{display:inline-block; padding-left:25px; width:auto}
.table_write .check_area > li:first-child{padding-left:0}
.table_write .check_area input[type=checkbox]{margin-right:3px}
.table_write .check_area_result{}
.table_write .check_area_result > li{display:block;}

/* 담당자 등록 */
.table_img_box img{width:139px; height:151px; overflow:hidden}

/* 그래프 */
.view_more{display:block ; background:url(../images/ico_set.png) no-repeat 0 -135px; width:46px; height:15px; padding:5px 0 0 5px; position:relative; left:500px; top:-40px; z-index:10 }
.view_more.type_water{position:relative; left:500px; top:-60px}
.view_all{display:block ; background:url(../images/ico_set.png) no-repeat 0 -111px; width:56px; height:17px; padding:3px 0 0 5px; margin-bottom:10px; margin-left:500px}

/* 그래프 페이지 */
/* 그래프 상단 인풋 */
.container_graph{min-width:1024px}
.container_graph .tit_h2{padding-left:10px; color:#fff}
.srch_wrap.type_graph{text-align:left; width:100%; background-color:#000}
.srch_wrap.type_graph:after{content:""; display:block; clear:both}
.srch_wrap.type_graph .srch_section1{float:left; width:54%; margin-left:0; padding-left:20px; text-align:left}
.srch_wrap.type_graph .srch_section2{float:right; margin-top:0; width:400px; height:28px; background:url(../images/img_graph.png) no-repeat 0 0; padding-right:20px}
.srch_wrap.type_graph .srch_section1 .date{margin-left:-2px}

/* 그래프위치 */
.graph_sec1{background-color:#000}
.graph_sec1 .graph_float_area{width:99.5%; margin:0 auto; /*border-top:1px solid #c8caca; border-left:1px solid #c8caca;*/}
.graph_sec1 .graph_float_area:after{content:""; display:block; clear:both}
.graph_sec1 .graph_float_area > li{float:left; overflow:hidden; width:33%; margin-right:3px; /*border-bottom:1px solid #c8caca; border-right:1px solid #c8caca; */}
/*
.graph_sec1 .graph_float_area > li.border_t{border-top:1px solid #c8caca}
.graph_sec1 .graph_float_area > li.border_b{border-bottom:1px solid #c8caca}
*/
.graph_sec1 .graph_float_area .graph_area .graph_header{border-top:0}
.graph_sec1 .graph_float_area .graph_area .graph_header{border-top:0}
.graph_sec1 .graph_float_area .graph_area .graph_box{margin-top:-50px; margin-bottom:10px; padding-bottom:20px; background-color:#fff}
.graph_sec1 .graph_float_area .highcharts-legend{display:none}
.graph_sec2{margin-top:50px; background-color:#000}
.graph_sec2 .graph_float_area{width:99.5%; /*border-top:1px solid #c8caca; border-left:1px solid #c8caca;*/}
.graph_sec2 .graph_float_area:after{content:""; display:block; clear:both}
.graph_sec2 .graph_float_area > li{float:left; overflow:hidden; width:33%; margin-right:3px/* border-bottom:1px solid #c8caca; border-right:1px solid #c8caca; */}
/*
.graph_sec2 .graph_float_area > li.border_b{border-bottom:1px solid #c8caca}
*/
.graph_sec2 .graph_float_area .graph_area .graph_header{border-top:0}
.graph_sec2 .graph_float_area .graph_area .graph_box{margin-top:-50px; margin-bottom:10px; padding-bottom:20px; background-color:#fff}
/*.graph_sec2 .graph_float_area .highcharts-legend{display:none}*/
.container_graph .ico_print{position:absolute; right:20px; top:145px; width:44px; overflow:hidden; }



}


